<template>
  <div class="bimVisual-container">
    <!-- bim容器 -->
    <div class="BlackHole-container" ref="blackHoleContainer"></div>
    <div class="loading-container" v-if="loading">
      <a-spin size="large"></a-spin>
    </div>
  </div>
</template>
<script>
import { canvasHolder } from "@/blackHoleTools/CanvasHolder";
import { releaseEngine, initialSDKModule } from "@/blackHoleTools/Engine";
import { mapGetters } from "vuex";
export default {
  props: {
    currentRow: {
      type: Object,
      default: () => {},
    },
  },
  data() {
    return {
      loading: true,
    };
  },
  computed: {
    ...mapGetters(["blackHoleAssetsPreFetch", "blackHoleRESystemCreated"]),
  },
  watch: {
    blackHoleAssetsPreFetch: {
      handler(val) {
        this.$nextTick((_) => {
          if (val) {
            initialSDKModule();
          }
        });
      },
      immediate: true,
    },

    blackHoleRESystemCreated: {
      handler(val) {
        if (val) {
          this.$nextTick((_) => {
            this.addEventListener();
            this.onEngineCreated();
          });
        }
      },
      immediate: true,
    },
  },
  methods: {
    addEventListener() {
      window.addEventListener("resize", this.onResize);

      //场景模型加载完成回调
      document.addEventListener(
        "REDataSetLoadFinish",
        this.dataSetLoadFinishCallBack
      );

      //监听加载进度
      document.addEventListener(
        "REDataSetLoadProgress",
        this.REDataSetLoadProgress
      );
    },

    //监听Bim加载进度
    REDataSetLoadProgress(e) {
      var percent = e.detail.progress;
      this.loading = true;
      if (percent >= 100) {
        this.loading = false;
      }
    },

    dataSetLoadFinishCallBack() {
      //设置相机方位
      let camLoc = new BlackHole3D.RECamLoc();
      camLoc.camDir = [
        0.2539295841379155,
        0.9182353441021792,
        -0.3039138350603636,
      ];
      camLoc.camPos = [
        13290502.87778086,
        4129220.8118116995,
        75.21442826148837,
      ];
      camLoc.camRotate = [
        0.5845919972547116,
        -0.07934279561223866,
        -0.10859265322241328,
        0.8001028391377565,
      ];
      BlackHole3D.Camera.setCamLocateTo(camLoc, 0.5, 1);

      //
      BlackHole3D.Graphics.setSysUIPanelVisible(false);
      //
      BlackHole3D.Graphics.setGeoCoordVisible(false);
      //
      BlackHole3D.Graphics.setViewCubeVisible(false);
    },

    //系统引擎创建完成回调【加载模型资源】
    onEngineCreated() {
      let dom = this.$refs.blackHoleContainer;
      let BlackHole3D = window.BlackHole3D;
      canvasHolder.moveCanvasToTarget(this.$refs.blackHoleContainer);
      BlackHole3D.m_re_em_window_width = dom.clientWidth;
      BlackHole3D.m_re_em_window_height = dom.clientHeight;
      BlackHole3D.Coordinate.setEngineWorldCRS("EPSG:3857");
      //开始加载一个或多个模型资源
      BlackHole3D.Model.loadDataSet([
        //天地图
        {
          dataSetId: "3a1410137d281ff927769a013637b65b",
          resourcesAddress:
            "https://bh.jszhgd.cn:8088/blackHole3D/EngineRes/RequestEngineRes?dir=url_res02&path=3a1410137d281ff927769a013637b65b",
          useTransInfo: true,
          transInfo: [
            [1, 1, 1],
            [0, 0, 0, 1],
            [0.0, 0.0, 0.0],
          ],
          dataSetCRS: "",
        },
        //模型
        {
          dataSetId: "3a140f98b5ff22d810cbfd7a2847eee8",
          resourcesAddress:
            "https://bh.jszhgd.cn:8088/blackHole3D/EngineRes/RequestEngineRes?dir=url_res02&path=3a140f98b5ff22d810cbfd7a2847eee8",
          useTransInfo: true,
          transInfo: [
            [1, 1, 1],
            [0, 0, 0, 1],
            [13290019.459747817, 4125544.8708128068, 0.5432810837943975],
          ],
          dataSetCRS: "",
        },
      ]);
      //设置渲染时引擎最大限制的显存占用空间(以MB为单位)
      BlackHole3D.Common.setMaxResMemMB(3000);
      //设置渲染时引擎期望分配的显存空间(以MB为单位)
      BlackHole3D.Common.setExpectMaxInstMemMB(2500);
      //设置模型每帧最大渲染面数
      BlackHole3D.Common.setExpectMaxInstDrawFaceNum(10000000);
      //设置页面调度等级，等级越高，模型加载越快，对硬件要求越高
      BlackHole3D.Common.setPageLoadLev(2);
    },

    //监听窗口尺寸变化
    onResize() {
      let box = this.$refs["blackHoleContainer"];
      if (box) {
        window.BlackHole3D.m_re_em_window_width = window.innerWidth;
        window.BlackHole3D.m_re_em_window_height = window.innerHeight;
      }
    },

    removeEventListener() {
      document.removeEventListener(
        "REDataSetLoadFinish",
        this.dataSetLoadFinishCallBack
      );
      window.removeEventListener("resize", this.onResize);

      document.removeEventListener(
        "REDataSetLoadProgress",
        this.REDataSetLoadProgress
      );
    },
  },
  destroyed() {
    this.removeEventListener();
    releaseEngine();
  },
  beforeDestroy() {},
};
</script>

<style lang="less" scoped>
.bimVisual-container {
  height: 100%;
  width: 100%;
  position: relative;
  .loading-container {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  .BlackHole-container {
    width: 100%;
    height: 100%;
  }
}
</style>
